<template>
	<view>
		<u-popup :show="show" mode="bottom"  @close="close" @open="open" closeable>
		        <view style="min-height: 400rpx;">
		          <view class="" style="font-weight: 800;margin-top: 10px;margin-left: 10px;">
		          						评论区
		          </view>
				   <scroll-view style="height: 65vh;" :scroll-top="scrollTop" scroll-y="true" class="scroll-Y" @scrolltoupper="upper" @scrolltolower="lower"
				                  @scroll="scroll">
						<comment-list-itme style="width: 90%;margin: 10px auto;" 
						v-for="item in treeData" :key="item.id"
						 :comment="item" @sedComment="sedComment" @deleteComment="deleteComment">
						 
						 </comment-list-itme>
								<u-loadmore :status="status" />
				   </scroll-view>
		        </view>
			</u-popup>
			
			<u-toast ref="uuToast"></u-toast>
	</view>
</template>

<script>	
	import commentListItme from '../comment-list-item/comment-list-item.vue'
	import {commentTree} from '../../static/utils'
	export default {
		name:"comment-list",
		components:{
			commentListItme,
		},
		props:{
			show:{
				type:Boolean,
				default:false
			},
			commentList:{
				type:[Array,Object],
				default:function(){
					return []
				}
			}
			
		},
		
		
	
		data() {
			return {
				status:'loadmore',
				 scrollTop: 0,
				 old: {
				    scrollTop: 0
				 },
				
				treeData:[],
				  blogId:'',
				page:1,
				limit:10
			};
		},
		
		methods:{
			open() {
			  this.treeData=commentTree(this.commentList)
			},
			close() {
				
			  this.$emit('showCommentList',false)
			  this.commentList=[]
			 
			  this.page=1
			  // console.log('close');
			},
			upper: function(e) {
				
			            

			},
	
			lower: function(e) {
				
			        /*  this.page++
			          this.getCommentList() */
			},
			scroll: function(e) {
			
			      
			            this.old.scrollTop = e.detail.scrollTop
			},
			goTop: function(e) {
			            this.scrollTop = this.old.scrollTop
			            this.$nextTick(() => {
			                this.scrollTop = 0
			        });
			        uni.showToast({
			                icon:"none",
			                title:"纵向滚动 scrollTop 值已被修改为 0"
			        })
			},
			deleteComment(id){
				/* 删除的评论id */
				console.log(id)
				
						
					
							
				
			},
			refreshData(){
				this.page=1
				this.commentList=[]
				
			},
			sedComment(val,parentId,parentUserName){
				/* *
				 val:输入的评论内容
				 parentId父级评论Id
				 parentUserName:附级评论用户名
				 */
			
				console.log(val,parentId,parentUserName)
			
			},
			showToast() {
				let params={
					type: 'success',
					message: "发表成功",
					iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/success.png'
				}
				console.log("aa")
				this.$refs.uuToast.show({...params})
			},
			getCommentList(){
				
				
				
				
			},
			getCommentListAll(){
				
				
			},
		}
	}
</script>

<style lang="scss">

</style>
